<template>
  <div class="app-container common-list-page">
    <el-form
      ref="resetForm"
      :model="resetForm"
      :rules="resetFormRules"
      status-icon
      label-width="100px"
    >
      <el-form-item label="旧密码：" prop="oldPassword">
        <el-input v-model="resetForm.oldPassword" type="password" auto-complete="off" />
      </el-form-item>
      <el-form-item label="新密码：" prop="newPassword">
        <el-input v-model="resetForm.newPassword" type="password" auto-complete="off" />
      </el-form-item>
      <el-form-item label="确认密码：" prop="newpassword1">
        <el-input v-model="resetForm.newpassword1" type="password" auto-complete="off" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click.native.prevent="toAmend">确认修改</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { resetpsw } from '@/api/user'
export default {
  data() {
    var validatePass = (rule, value, callback) => {
      if (!value) {
        callback(new Error('请输入新密码'))
      } else if (value.toString().length < 6 || value.toString().length > 32) {
        callback(new Error('密码长度为6-32位'))
      } else {
        callback()
      }
    }
    var validatePass2 = (rule, value, callback) => {
      if (value === '') {
        callback(new Error('请再次输入密码'))
      } else if (value !== this.resetForm.newPassword) {
        callback(new Error('两次输入密码不一致!'))
      } else {
        callback()
      }
    }
    return {
      resetForm: {
      // 传给后台所需要的参数
        oldPassword: '',
        newPassword: ''
      },
      resetFormRules: {
        oldPassword: [
          { required: true, message: '请输入旧密码', trigger: 'blur' }
        ],
        newPassword: [
          { required: true, validator: validatePass, trigger: 'blur' }
        ],
        newpassword1: [
          { required: true, validator: validatePass2, trigger: 'blur' }
        ]
      }
    }
  },
  methods: {

    // onSubmit(user) {
    // this.data = { oldPassword, newPassword }
    // this.$refs.user.validate(valid => {
    //   if(valid) {
    //     resetpsw(this.user).then(() => {
    //       this.$message({
    //         message: '修改成功！',
    //         type: 'success',
    //         duration: 5 * 1000
    //       })
    //     })
    //   }
    // }),

    toAmend() {
      this.$refs.resetForm.validate(valid => {
        if (valid) {
          console.log(this.resetForm)
          // console.log(this.resetForm.oldPassword)
          resetpsw(this.resetForm.oldPassword, this.resetForm.newPassword).then(res => {
            if (res.resultCode === 200) {
              this.$message.success('修改成功！')
            }
          }).catch(() => {})
        }
      })
    },

    // getUser() {
    //   this.user = {
    //     // email: 'admin@test.com',
    //     password: this.password
    //   }
    // },

    showPwd() {
      if (this.passwordType === 'password') {
        this.passwordType = ''
      } else {
        this.passwordType = 'password'
      }
      this.$nextTick(() => {
        this.$refs.password.focus()
      })
    }

    // // 提交事件
    // onSubmit(formName) {
    //   this.user = JSON.parse(localStorage.getItem("user"))
    //   this.$refs[formName].validate(valid => {
    //     //valid 全为 true即执行以下操作
    //     if(valid) {
    //       this.$http
    //         .post('api/v1/edituser', {
    //           id: this.form.id,
    //           lastpassword: this.form.lastpassword,
    //           password: this.form.password,
    //           qrpassword: this.form.qrpassword
    //         })
    //         .then(function(result) {
    //           if(result.body.status == 200) {
    //             MessageBox.alert('操作成功').then(action => {
    //               this.$router.push('../login/index')
    //             });
    //           } else if(result.body.status == 201) {
    //             Toast({
    //               message: result.body.message,
    //               duration: 2000
    //             });
    //           }
    //         }, function(result) {
    //           Toast({
    //             message: "服务器异常",
    //             duration: 2000
    //           })
    //         });
    //     } else {
    //       this.$message.error('请正确填写表单')
    //       return false
    //     }
    //   })
    // }

  }
  // getZhang() {
  //   this.user = JSON.parse(localStorage.getItem("user"))
  //   this.zhanghao = this.user.username
  // },
  // change_back(){
  //   this.$router.push('/tabs/my')
  // },

  // },
}
</script>

<style lang="scss" scoped>
  .password-changed {
    margin-bottom: 22px;
  }
</style>
